@import "global.scss";

.footer {
  height: 48px; /* if you change me, also change the value in the golden layout root style, in ./index.tsx */
  background: $beige400;
  text-align: left;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  align-content: center;
}

.spacer {
  flex-grow: 1;
}

.restart {
  display: inline-block;
}

.status {
  margin: 0 $baseline;

  svg + span {
    color: $navy;
  }
}

:root a.logo,
:root a.logo:focus,
:root a.logo:hover {
  text-decoration: none;
  border: none;
  border-bottom: none;
  line-height: 48px;
}

.logo svg {
  height: 2em;
  margin: 0 16px 0 0;
  display: block;
  line-height: 48px;
}

@media screen and (max-width: 640px) {
  .status {
    margin: 0 $baseline/4;
  }
}
